<!DOCTYPE html>
<html lang="zxx">
    <head>
        <meta charset="utf-8">
        <title>
            Jordis - Responsive Bootstrap 4 Personal Website Template
        </title>
        <meta content="width=device-width, initial-scale=1.0" name="viewport">
        <meta content="" name="description">
        <meta content="" name="keywords">
        <meta content="" name="author"><!--[if lt IE 9]><script src="js/html5shiv.js"></script><![endif]--><!-- CSS Files ================================================== -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
        <link href="css/jpreloader.css" rel="stylesheet" type="text/css">
        <link href="css/animate.css" rel="stylesheet" type="text/css">
        <link href="css/owl.carousel.css" rel="stylesheet" type="text/css">
        <link href="css/owl.theme.css" rel="stylesheet" type="text/css">
        <link href="css/owl.transitions.css" rel="stylesheet" type="text/css">
        <link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
        <link href="css/jquery.countdown.css" rel="stylesheet" type="text/css">
        <link href="css/style.css" rel="stylesheet" type="text/css"><!-- color scheme -->
        <link id="colors" href="css/colors/scheme-01.css" rel="stylesheet" type="text/css">
        <link href="css/coloring.css" rel="stylesheet" type="text/css">
    </head>
    <body>
        <div id="wrapper">
            <div id="btn-exit">
                <div class="line-1"></div>
                <div class="line-2"></div>
            </div>
            <div class="transition"></div><!-- header begin -->
            <header class="transparent">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="d-flex justify-content-between">
                                <div class="align-self-center header-col-left">
                                    <!-- logo begin -->
                                    <div id="logo">
                                        <a href="index.html">Amalia Jördis</a>
                                    </div><!-- logo close -->
                                </div>
                                <div class="align-self-center ml-auto header-col-mid">
                                    <!-- mainmenu begin -->
                                    <ul id="mainmenu" class="scrollnav">
                                        <li>
                                            <a href="#section-resume">Resume</a>
                                        </li>
                                        <li></li>
                                        <li>
                                            <a href="#section-about">About Me</a>
                                        </li>
                                        <li></li>
                                        <li>
                                            <a href="#section-portfolio">Portfolio</a>
                                        </li>
                                        <li></li>
                                        <li>
                                            <a href="#section-blog">Blog</a>
                                        </li>
                                        <li></li>
                                        <li>
                                            <a href="#section-contact">Contact</a>
                                        </li>
                                        <li></li>
                                    </ul><!-- mainmenu close -->
                                </div>
                                <div class="align-self-center ml-auto header-col-right">
                                    <div class="social-icons s-border sm-hide">
                                        <a href="#"><i class="fa fa-facebook fa-lg"></i></a><a href="#"><i class="fa fa-twitter fa-lg"></i></a><a href="#"><i class="fa fa-linkedin fa-lg"></i></a><a href="#"><i class="fa fa-instagram fa-lg"></i></a>
                                    </div><span id="menu-btn"></span>
                                </div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </header><!-- header close --><!-- content begin -->
            <div class="no-bottom no-top dark">
                <div id="top"></div><!-- section begin -->
                <section id="section-main" class="vertical-center text-light" data-bgimage="url(images/background/2.jpg) top">
                    <div class="container">
                        <div class="row align-items-center">
                            <div class="col-md-6">
                                <h1 class="wow fadeInRight" data-wow-delay=".4s">
                                    I'm <span class="id-color">Amalia</span> Jordis
                                </h1>
                                <p class="lead wow fadeInRight" data-wow-delay=".5s">
                                    At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.
                                </p>
                                <div class="spacer-single"></div><a href="#section-about" class="btn-custom light wow fadeInRight scoll-to" data-wow-delay=".6s">Download CV</a>
                            </div>
                            <div class="col-md-6 sm-hide">
                                <blockquote class="text-light pull-right wow fadeInRight" data-wow-delay=".6s">
                                    Be creative and have fun!
                                </blockquote>
                            </div>
                        </div>
                    </div>
                </section><!-- section close -->
                <!-- section begin -->
                <section id="section-resume" class="dark">
                    <div class="container">
                        <div class="row align-items-center">
                            <div class="col-lg-12 wow fadeInRight">
                                <h4 class="title">
                                    I'm available for hire
                                </h4>
                                <h2 class="title">
                                    My Resume
                                </h2>
                                <div class="title-underline"></div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 wow fadeInRight" data-wow-delay=".25s">
                                <h3 class="s_border">
                                    Education
                                </h3>
                                <ul class="d_timeline">
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2002 - Mar 2003
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Master in Design<span>New York University</span></span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2002 - Mar 2003
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Bachelor of Arts<span>University of London</span></span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2002 - Mar 2003
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Artist of College</span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                </ul>
                            </div>
                            <div class="col-md-6 wow fadeInRight" data-wow-delay=".5s">
                                <h3 class="s_border">
                                    Work Experiences
                                </h3>
                                <ul class="d_timeline">
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2015 - 2019
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Lead &amp;UI / UX Designer<span>Apple</span></span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2010 - Mar 2015
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Senior &amp;UI / UX Designer<span>Google</span></span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                    <li class="d_timeline-item">
                                        <h3 class="d_timeline-title">
                                            Feb 2006 - Mar 2010
                                        </h3>
                                        <p class="d_timeline-text">
                                            <span class="d_title">Junior &amp;UI / UX Designer<span>Microsoft</span></span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Animi tempora perferendis vero officia enim impedit voluptatem dignissimos,veniam ratione est alias rerum aperiam,nam aliquam reprehenderit iste dolor.
                                        </p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="spacer-50"></div>
                        <div class="row">
                            <div class="col-md-6">
                                <h3 class="s_border">
                                    Programming Skills
                                </h3>
                                <div class="skill-bar">
                                    <h5>
                                        HTML &amp;CSS
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="95%"></div>
                                    </div>
                                </div>
                                <div class="skill-bar">
                                    <h5>
                                        Javascript
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="75%"></div>
                                    </div>
                                </div>
                                <div class="skill-bar">
                                    <h5>
                                        PHP
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="85%"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <h3 class="s_border">
                                    Other Skills
                                </h3>
                                <div class="skill-bar">
                                    <h5>
                                        Copywritting
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="75%"></div>
                                    </div>
                                </div>
                                <div class="skill-bar">
                                    <h5>
                                        Drawing
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="90%"></div>
                                    </div>
                                </div>
                                <div class="skill-bar">
                                    <h5>
                                        Singing
                                    </h5>
                                    <div class="de-progress">
                                        <div class="value"></div>
                                        <div class="progress-bar" data-value="80%"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section><!-- section close --><!-- section begin -->
                <section id="section-about" class="dark">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-12 wow fadeInRight">
                                <h4 class="title">
                                    Who I Am
                                </h4>
                                <h2 class="title">
                                    About Me
                                </h2>
                                <div class="title-underline"></div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-sm-30 text-center">
                                <div class="de-images">
                                    <div class="d-hover-zoom wow fadeInRight">
                                        <a class="image-popup" href="images/misc/1.jpg"><img class="img-fluid" src="images/misc/1.jpg" alt=""></a>
                                    </div>
                                    <div class="d-hover-zoom di-small-2 wow fadeInLeft">
                                        <a class="image-popup" href="images/misc/2.jpg"><img src="images/misc/2.jpg" alt=""></a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-5 offset-md-1 wow fadeInRight" data-wow-delay=".5s">
                                <h2>
                                    Hello,I'm <span class="id-color">Amalia Jördis</span>
                                </h2>
                                <p>
                                    At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Veniam dolore qui sunt dolor anim est proident culpa.
                                </p>
                                <ul class="info-list text-white">
                                    <li>
                                        <span class="d_title">Age</span><span class="d_value">28</span>
                                    </li>
                                    <li>
                                        <span class="d_title">Residence</span><span class="d_value">USA</span>
                                    </li>
                                    <li>
                                        <span class="d_title">Address</span><span class="d_value">08 W 36th St, New York, NY 10001</span>
                                    </li>
                                    <li>
                                        <span class="d_title">Email</span><span class="d_value">contactme@envato.com</span>
                                    </li>
                                    <li>
                                        <span class="d_title">Phone</span><span class="d_value">+1 333 1224 6779</span>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="spacer-80"></div>
                        <div class="row">
                            <div class="col-md-12">
                                <h3 class="s_border">
                                    My Services
                                </h3>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-laptop id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            Website Design
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30 wow fadeInRight" data-wow-delay=".25s">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-paper-plane-o id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            Email Marketing
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb-30 wow fadeInRight" data-wow-delay=".5s">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-line-chart id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            Digital Analytics
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb-sm-30 wow fadeInRight" data-wow-delay="0s">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-object-group id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            Visual Editor
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb-sm-30 wow fadeInRight" data-wow-delay=".25s">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-hdd-o id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            Backup & Security
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb-sm-30 wow fadeInRight" data-wow-delay=".5s">
                                <div class="f-box f-icon-left f-icon-box">
                                    <i class="fa fa-comments-o id-color"></i>
                                    <div class="fb-text">
                                        <h4>
                                            IT Consultancy
                                        </h4>
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="spacer-80"></div>
                        <div class="row">
                            <div class="col-md-12">
                                <h3 class="s_border">
                                    Testimonials
                                </h3>
                            </div>
                            <div class="col-md-12">
                                <div id="testimonial-carousel" class="owl-carousel owl-theme wow fadeInUp">
                                    <blockquote class="testimonial-big text-light">
                                        I'm always impressed with the services. Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip. <img src="images/people/1.jpg" alt=""><span class="name">John,Customer</span>
                                    </blockquote>
                                    <blockquote class="testimonial-big text-light">
                                        I'm always impressed with the services. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. <img src="images/people/2.jpg" alt=""> <span class="name">Sandra, Customer</span>
                                    </blockquote>
                                    <blockquote class="testimonial-big text-light">
                                        I'm always impressed with the services. Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip. <img src="images/people/3.jpg" alt=""><span class="name">Michael,Customer</span>
                                    </blockquote>
                                    <blockquote class="testimonial-big text-light">
                                        I'm always impressed with the services. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. <img src="images/people/4.jpg" alt=""> <span class="name">George, Customer</span>
                                    </blockquote>
                                </div>
                            </div>
                        </div>
                    </div>
                </section><!-- section close -->
                <!-- section begin -->
                <section id="section-portfolio" class="dark">
                    <div class="container">
                        <!-- portfolio filter begin -->
                        <div class="row">
                            <div class="col-lg-12 wow fadeInRight">
                                <h4 class="title">
                                    Showcase of my best works
                                </h4>
                                <h2 class="title">
                                    My Portfolio
                                </h2>
                                <div class="title-underline"></div>
                            </div>
                            <div class="col-md-12 text-center wow fadeInRight" data-wow-delay=".25s">
                                <ul id="filters">
                                    <li>
                                        <a href="#" data-filter="*" id="btn_all" class="selected">all projects</a>
                                    </li>
                                    <li>
                                        <a href="#" data-filter=".illustration">illustration</a>
                                    </li>
                                    <li>
                                        <a href="#" data-filter=".mobile">mobile</a>
                                    </li>
                                    <li>
                                        <a href="#" data-filter=".photography">photography</a>
                                    </li>
                                    <li>
                                        <a href="#" data-filter=".website">website</a>
                                    </li>
                                </ul>
                                <div id="gallery" class="gallery full-gallery de-gallery zoom-gallery row sequence wow fadeInRight" data-wow-delay=".5s">
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item illustration website" data-value="project-details-image.html">
                                        <a class="picframe" href="images/portfolio/1.jpg" title="Exhibiz" data-source="https://themeforest.net/item/exhibiz-event-conference-and-meetup/28663470"><span class="overlay"><span class="d-title">Exhibiz</span></span> <img src="images/portfolio/1.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item photography">
                                        <a class="picframe" href="images/portfolio/2.jpg" title="Bolo" data-source="https://themeforest.net/item/bolo-onepage-creative-website-template/25030305"><span class="overlay"><span class="d-title">Bolo</span></span> <img src="images/portfolio/2.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item illustration">
                                        <a class="picframe" href="images/portfolio/3.jpg" title="Elaxo" data-source="https://themeforest.net/item/elaxo-app-and-software-website-template/29226060"><span class="overlay"><span class="d-title">Elaxo</span></span> <img src="images/portfolio/3.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item photography illustration mobile">
                                        <a class="picframe" href="images/portfolio/4.jpg" title="Jonna" data-source="https://themeforest.net/item/jonna-personal-portfolio-website-template/26361888"><span class="overlay"><span class="d-title">Jonna</span></span> <img src="images/portfolio/4.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item photography mobile website">
                                        <a class="picframe" href="images/portfolio/5.jpg" title="Justica" data-source="https://themeforest.net/item/justica-lawyer-and-attorney-website-template/29485331"><span class="overlay"><span class="d-title">Justica</span></span> <img src="images/portfolio/5.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                    <!-- gallery item -->
                                    <div class="item col-md-4 mb30 gallery-item mobile website">
                                        <a class="picframe" href="images/portfolio/6.jpg" title="Bluetec" data-source="https://themeforest.net/item/bluetec-saas-it-software-startup-landing-page-template/27106031"><span class="overlay"><span class="d-title">Bluetec</span></span> <img src="images/portfolio/6.jpg" alt=""></a>
                                    </div><!-- close gallery item -->
                                </div>
                            </div><!-- portfolio filter close -->
                        </div>
                    </div>
                </section><!-- section close -->
                <!-- section begin -->
                <section id="section-blog" class="dark">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-12 wow fadeInRight">
                                <h4 class="title">
                                    This is my story
                                </h4>
                                <h2 class="title">
                                    My Blog
                                </h2>
                                <div class="title-underline"></div>
                            </div>
                        </div>
                        <div class="row wow fadeInRight" data-wow-delay=".25s">
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/1.jpg"><img alt="" src="images/news/1.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">Better User Interface</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/2.jpg"><img alt="" src="images/news/2.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">Experts Web Design Tips</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/3.jpg"><img alt="" src="images/news/3.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">Importance Of Web Design</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/4.jpg"><img alt="" src="images/news/4.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">Avoid These Erros In UI Design</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/5.jpg"><img alt="" src="images/news/5.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">Make Mobile Website Faster</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6 mb30">
                                <div class="bloglist item">
                                    <div class="post-content">
                                        <div class="post-image d-hover-zoom">
                                            <a class="image-popup" href="images/news/6.jpg"><img alt="" src="images/news/6.jpg"></a>
                                            <div class="post-info">
                                                <div class="inner">
                                                    <span class="post-date">10 Dec 2020</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="post-text">
                                            <h4>
                                                <a href="blog-single.html">How Sell Digital Product</a>
                                            </h4>
                                            <p>
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section><!-- section close -->
                <!-- section begin -->
                <section id="section-contact" class="dark">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-12 wow fadeInRight">
                                <h4 class="title">
                                    I'm available for hire
                                </h4>
                                <h2 class="title">
                                    Contact Me
                                </h2>
                                <div class="title-underline"></div>
                            </div>
                        </div>
                        <form name="contactForm" id="contact_form" class="row form-default wow fadeInRight" data-wow-delay=".25s" method="post" action="email.php">
                            <div class="col-md-6">
                                <div class="field-set">
                                    <input type="text" name="name" id="name" class="form-control" placeholder="Your Name">
                                    <div class="line-fx"></div>
                                </div>
                                <div class="field-set">
                                    <input type="text" name="email" id="email" class="form-control" placeholder="Your Email">
                                    <div class="line-fx"></div>
                                </div>
                                <div class="field-set">
                                    <input type="text" name="phone" id="phone" class="form-control" placeholder="Your Phone">
                                    <div class="line-fx"></div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="field-set">
                                    <textarea name="message" id="message" class="form-control" placeholder="Your Message"></textarea>
                                    <div class="line-fx"></div>
                                </div>
                            </div>
                            <div class="spacer-single"></div>
                            <div class="col-md-12 text-center">
                                <div id="submit">
                                    <input type="submit" id="send_message" value="Send" class="btn btn-custom color-2">
                                </div>
                                <div id="mail_success" class="success">
                                    Your message has been sent successfully.
                                </div>
                                <div id="mail_fail" class="error">
                                    Sorry,error occured this time sending your message.
                                </div>
                            </div>
                        </form>
                    </div>
                </section>
            </div><!-- content close -->
        </div><!-- Javascript Files ================================================== -->
        <script src="js/jquery.min.js"></script>
        <script src="js/jpreLoader.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/wow.min.js"></script>
        <script src="js/jquery.isotope.min.js"></script>
        <script src="js/easing.js"></script>
        <script src="js/owl.carousel.js"></script>
        <script src="js/validation.js"></script>
        <script src="js/jquery.magnific-popup.min.js"></script>
        <script src="js/enquire.min.js"></script>
        <script src="js/jquery.stellar.min.js"></script>
        <script src="js/jquery.plugin.js"></script>
        <script src="js/typed.js"></script>
        <script src="js/typed-custom.js"></script>
        <script src="js/designesia.js"></script>
    </body>
</html>